<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <meta name="author" content="">
    <title></title>  <link rel="icon" href="/template/pc1/images/wmh_favicon.ico" type="image/x-icon" />
    <% include("../inc/input_css.html"){}%>

    <!--图片编辑器-->
    <link href="/res/plugins/img-viewing/viewer.css" rel="stylesheet">
    <!--图片编辑器-->
    <style>
        .col-sm-3{
            width: 17.5%;
        }
        .form-horizontal .control-label {
            text-align: right;
            width: 160px;
        }
        .form-group{
            padding-top: 10px;
        }
        .logo:hover{
            cursor: pointer;
        }
        .hover_img{
            width: 50px;
            height: 50px;
            background: rgba(8, 8, 8, 0.64);
            color: #fff;
            text-align: center;
            line-height: 50px;
            border-radius: 50%;
            position: absolute;
            margin-left: 12px;
            opacity: 0;
            cursor: pointer;
        }
        .hover_img:hover{
            opacity: 1;
        }
        .logo {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            margin-right: 4px;
            margin-left: 12px;
        }

    </style>

</head>
<body>
<div class="ibox">
    <div class="ibox-title">
        <div class="pull-left mbx navbar_title">
            <span class="current">企业信息</span>
            <span class="line">/</span>
            企业认证
        </div>
    </div>
    <div class="ibox-content" id="toastContent">
        <h4 style="margin-bottom: 15px;color: #5EABE8" class="padding-40" >企业信息登记</h4>
        <form method="post" action="" class="form-horizontal form-validate">
            <div class="form-group" style="line-height: 36px">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>品牌LOGO</label>

                <div class="col-sm-1">
                    <div class="hover_img"  onclick="_logo();">
                        上传
                    </div>
                    <%if(isNotEmpty(ci.brandLogo)){%>
                    <img src="${ci.brandLogo!}" class="logo img-rounded" id="logo" style=" border-radius: 50%;"/>
                    <%}else{%>
                    <img src="/res/img/9joy.png" class="logo img-rounded" id="logo" onclick="_logo();" style=" border-radius: 50%;"/>
                    <%}%>
                    <input type="hidden" id="brandLogo" value="${ci.brandLogo!}"/>
                    <input type ="file" id="_brandLogo" name="brandLogo" style="display: none"/>
                </div>
                <span class="help-block" style="margin-top: -8px"><span class="maroon"></span>上传规格：160x160px <br>上传格式：为png或jpg，等宽缩放</span>


            </div>
            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>品牌名称</label>
                <div class="col-sm-3">
                    <input type="text" id="brandName" value="${ci.brandName!}" class="form-control light-input" required="true">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>企业名称 </label>
                <div class="col-sm-3">
                    <input type="text" id="company_name" value="${ci.company_name!}" class="form-control light-input">
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2  control-label">所属行业</label>
                <div class="col-sm-8">
                    <div class="row">
                        <div class="col-sm-3" style="padding-left: 0px">
                            <select name="category_one" class="form-control" id="category_one" ></select>
                        </div>
                        <div class="col-sm-3">
                            <select name="category_two" class="form-control" id="category_two" ></select>
                        </div>

                        <script src="/res/plugins/jiuyue/category_select.js"></script>
                        <script type="text/javascript">
                            new category('category_one', 'category_two', '${category_one!}', '${category_two!}');
                        </script>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>营业执照注册号</label>
                <div class="col-sm-3">
                    <input type="text" id="business_licence_code" value="${ci.business_licence_code}" class="form-control light-input">
                </div>
                <span class="help-block"><span class="maroon"></span>请输入15位营业执照注册号或18位的统一社会信用代码</span>
            </div>

            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>营业执照扫描件</label>
                <div class="col-sm-3">
                    <%
                    var imgName="";
                    if(isNotEmpty(ci.imgName)){
                    var len=strutil.length(ci.imgName);
                    if(len>18){
                    imgName=strutil.subStringTo(ci.imgName,0,18)+"...";
                    }else{
                    imgName=ci.imgName;
                    }
                    }
                    %>
                    <%if(isNotEmpty(imgName)){%>
                    <button class="hive-btn margin-left-10" type="button" id="btn_licence_img"  title="${ci.imgName}">${imgName}</button>
                    <%}else{%>
                    <button class="hive-btn margin-left-10" type="button" id="btn_licence_img"  style="width: 100%" title="${ci.imgName}">上传营业执照</button>
                    <%}%>
                    <%if(isNotEmpty(ci.business_licence_img)){%>
                    <div style="text-align: center;padding: 3px"><img  class="docs-pictures" data-original="${ci.business_licence_img!}" src="${ci.business_licence_img!}" style="max-width:43px;"/></div>
                    <%}%>
                    <input type="hidden" id="business_licence_img" value="${ci.business_licence_img}"/>
                    <input type="hidden" id="imgName" value="${ci.imgName}"/>
                    <input type ="file" id="_licence_img" name="licence_img" style="display: none"/>
                </div>


                <span class="help-block"><span class="maroon"></span>请上传营业执照原件或副件的扫描件或数码照，支持 .jpg、png格式照片，大小不超过5M</span>
            </div>
            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>邮箱 </label>
                <div class="col-sm-3">
                    <input type="text" id="email" value="${ci.email}" class="form-control light-input ">
                </div>
                <span class="help-block"><span class="maroon"></span>建议用企业邮箱申请</span>
                <div class="col-sm-2" style="padding-left: 0px">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>邮箱验证码:</label>
                <div class="col-sm-7">
                    <div class="col-sm-2" style="padding-left: 0px;">
                        <input type="text" id="emailCode" value="" class="form-control light-input">
                    </div>
                    <div class="col-sm-1" style="padding-left: 0px;">
                        <button class="hive-btn margin-left-10" type="button" id="sendEmailCode">邮箱验证</button>
                    </div>
                </div>

            </div>
            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>运营者姓名</label>
                <div class="col-sm-3">
                    <input type="text" id="personInCharge" value="${ci.personInCharge!}" class="form-control light-input">
                </div>
            </div>


            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>运营者手机号</label>
                <div class="col-sm-3">
                    <input type="text" id="phone" value="${ci.phone!}" class="form-control light-input" readonly>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2  control-label"><span class="maroon">*</span>短信验证码</label>
                <div class="col-sm-7">
                    <div class="col-sm-2" style="padding-left: 0px">
                        <input type="text" id="phoneCode" value="" class="form-control light-input">
                    </div>
                    <div class="col-sm-1" style="padding-left: 0px;">
                        <button class="hive-btn margin-left-10" type="button" id="sendPhoneCode">短信验证</button>
                    </div>
                </div>

            </div>

            <div class="form-group">
                <div class="col-sm-3" style="text-align: -webkit-right;">
                    <button id="submit" class="hive-btn hive-btn-primary margin-left-15" type="button" value="" style="background-color: #3276b1;width: 70px">提交</button>
                </div>
            </div>



        </form>
    </div>
</div>

<!-- Core  -->
</body>
<% include("../inc/input_js.html"){}%>
<!-- 自定义js -->
<script src="/res/js/ajaxfileupload.js"></script>

<!--图片编辑器-->
<script src="/res/plugins/img-viewing/main.js"></script>
<script src="/res/plugins/img-viewing/viewer.js"></script>
<!--图片编辑器-->
<script>
    //ajaxfileupload上传logo
    function _logo() {
        $('#_brandLogo').click();
        $('#_brandLogo').on('change', function () {
            $.ajaxFileUpload({
                url: "/file/newuploadfile?shopId=0&type=d",
                type: "GET",
                secureuri: false,
                fileElementId: '_brandLogo',//file标签的id
                dataType: 'json',//返回数据的类型
                //data: {"id": v},//一同上传的数据
                success: function (data) {
                    if(data.code==0){
                        $("#logo").attr("src",data.url);
                        $("#brandLogo").val(data.url);
                    }else{
                        layer.msg("失败");
                    }

                },
                error:function (data) {
                    layer.msg("失败");


                }
            });
        })

    }

    //ajaxfileupload上传营业执照扫描件
    $(document).on('click','#btn_licence_img',function () {
        $('#_licence_img').click();
        $('#_licence_img').on('change', function () {
            $.ajaxFileUpload({
                url: "/file/newuploadfile?shopId=0&type=d",
                type: "GET",
                secureuri: false,
                fileElementId: '_licence_img',//file标签的id
                dataType: 'json',//返回数据的类型
                //data: {"id": v},//一同上传的数据
                success: function (data) {
                    if(data.code==0){
                        var resFileName=data.resFileName;
                        if(resFileName.length>18){
                            resFileName=resFileName.substring(0,18)+"...";
                        }
                        $("#btn_licence_img").html(resFileName);
                        $("#btn_licence_img").attr("title",data.resFileName);

                        $("#business_licence_img").val(data.url);
                        $("#imgName").val(data.resFileName);
                        $(".docs-pictures").attr("data-original",data.url);
                        $(".docs-pictures").attr("src",data.url);

                    }else{
                        layer.msg("失败");
                    }

                },
                error:function (data) {
                    layer.msg("失败");


                }
            });
        })
    });

</script>
<script>
    $("#sendPhoneCode").on('click', function () {
        var regPhone = /^0?(13[0-9]|15[0-9]|17[0-9]|18[0-9]|14[57])[0-9]{8}$/ ; //手机正则表达式
        var phone=$("#phone").val();
        if(!regPhone.test(phone)){
            layer.msg("请输入正确的手机号!");
            return false;
        }
        $.ajax({
            url: "/shop/companyinfo/getPhoneCode",
            type: 'GET',
            data:{
                "phone": phone
            },
            success: function(data){
                if (data.state=="ok" == true){
                    layer.msg("验证码发送成功");
                    setPhoneTime();
                }else{
                    layer.msg(data.info);
                }
            }});

    });
    var phonetime = 60;
    function setPhoneTime() {
        phonetime--;
        $("#sendPhoneCode").attr('disabled', 'disabled');
        $("#sendPhoneCode").html(phonetime + " s ");
        if (phonetime > 0) {
            setTimeout(setPhoneTime, 1000);
        } else {
            $("#sendPhoneCode").attr('disabled', false);
            $("#sendPhoneCode").html("验证码");
            phonetime = 60;
        }
    }


    //邮箱验证码
    $("#sendEmailCode").on('click', function () {
        var regEmail =/^[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?$/; //邮箱正则表达式
        var email=$("#email").val();
        if(!regEmail.test(email)){
            layer.msg("请输入正确的邮箱格式!");
            return false;
        }

        $.ajax({
            url: "/shop/companyinfo/getEmailCode",
            type: 'GET',
            data:{
                "email": email
            },
            success: function(data){
                if (data.state=="ok" == true){
                    layer.msg("验证码发送成功");
                    setEmailTime();
                }else{
                    layer.msg(data.info);
                }
            }});

    });
    var emailtime = 60;
    function setEmailTime() {
        emailtime--;
        $("#sendEmailCode").attr('disabled', 'disabled');
        $("#sendEmailCode").html(emailtime + " s ");
        if (emailtime > 0) {
            setTimeout(setEmailTime, 1000);
        } else {
            $("#sendEmailCode").attr('disabled', false);
            $("#sendEmailCode").html("验证码");
            emailtime = 60;
        }
    }

    $("#submit").click(function () {
        var imgName=$("#imgName").val();
        var category_one=$("#category_one").val();//一级类目
        var category_two=$("#category_two").val();//二级类目
        var brandLogo=$("#brandLogo").val();
        var brandName=$("#brandName").val();
        var company_name=$("#company_name").val();
        var business_licence_code=$("#business_licence_code").val();//
        var business_licence_img=$("#business_licence_img").val();
        var email=$("#email").val();
        var emailCode=$("#emailCode").val();
        var personInCharge=$("#personInCharge").val();
        var phone=$("#phone").val();
        var phoneCode=$("#phoneCode").val();
        var regEmail =/^[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?$/; //邮箱正则表达式
        if(!brandLogo){
            layer.msg("请上传品牌LOGO!");
            return false;
        }
        if(!brandName){
            layer.msg("请填写品牌名称!");
            return false;
        }
        if(!company_name){
            layer.msg("请填写企业名称!");
            return false;
        }
        if(!business_licence_code){
            layer.msg("请填写营业执照注册号!");
            return;
        }
        if(!business_licence_img){
            layer.msg("请上传营业执照扫描件!");
            return;
        }
        if(!regEmail.test(email)){
            layer.msg("请输入正确的邮箱格式!");
            return false;
        }
        if(!emailCode){
            layer.msg("请输入邮箱验证码!");
            return false;
        }
        if(!personInCharge){
            layer.msg("请输入运营者姓名!");
            return false;
        }
        if(!phoneCode){
            layer.msg("请输入短信验证码!");
            return false;
        }
        $.ajax({
            url: "/shop/companyinfo/certificationSave",
            type: 'GET',
            data:{
                "brandLogo":brandLogo,
                "brandName":brandName,
                "company_name": company_name,
                "business_licence_code": business_licence_code,
                "business_licence_img": business_licence_img,
                "email": email,
                "emailCode": emailCode,
                "personInCharge": personInCharge,
                "phone": phone,
                "phoneCode": phoneCode,
                "categories":category_one+","+category_two,
                "imgName":imgName
            },
            success: function(data){
                if (data.state=="ok" == true){
                    window.location.href="/shop/companyinfo/detail";
                }else{
                    layer.msg(data.info);
                }
            }});

    });
</script>
</html>